import {Badge} from "antd-mobile/es/components/badge/badge";
import {CloseCircleOutline, EditSOutline} from "antd-mobile-icons";

interface PassengerProps {
    name: string,
    type: "成人票"|"学生票"|"儿童票",
    id_type: string,
    id_num: string,
    onEdit?: (passenger: any|undefined)=>void,
    onDelete?: (passenger: any|undefined)=>void
}
const PassengerItem = (props: PassengerProps) => {

    return (
        <>
            <div style={{
                display: "flex",
                justifyContent: "space-between",
                alignItems: "center"
            }}>
                <div>
                    <h3 style={{fontWeight: "bold", margin: 0}}>
                        {props.name}{" "}
                        <Badge content={props.type} color={"green"} style={{padding: "4px"}}/>
                    </h3>
                    <p style={{margin: 0}}>{props.id_type}{" "}{props.id_num}</p>
                </div>
                <span style={{color: "green", fontSize: "1.5rem"}}>
                    <EditSOutline onClick={props.onEdit}/>
                    {" "}
                    <CloseCircleOutline onClick={props.onDelete}/>
                </span>
            </div>
        </>
    )
}

export default PassengerItem;
